// 公共样式
export const commonStyle = {
    rotate: 0,
    opacity: 1,
}

export const commonAttr = {
    animations: [],
    events: {},
    groupStyle: {}, // 当一个组件成为 Group 的子组件时使用
    isLock: false, // 是否锁定组件
    collapseName: 'style', // 编辑组件时记录当前使用的是哪个折叠面板，再次回来时恢复上次打开的折叠面板，优化用户体验
    linkage: {              //链接指一个动作可以影响本身的若干属性
        duration: 0, // 过渡持续时间
        data: [ // 组件联动
            {
                id: '', // 联动的组件 id
                label: '', // 联动的组件名称
                event: '', // 监听事件，可以是点击或悬浮
                style: [{ key: '', value: '' }], // 监听的事件触发时，需要改变的属性
            },
        ],
    },

    isSelected:  false,  //绘制图标的是否选中, 改为使用vuex中的 iSelectShapeIndex
}

//关联点
//dbid    redis中的select 命令选择的数据库
//key     redis中的字段
//field   redis中hash值的字段名字
export const hg3000Attr = {
    //linkid:{ dbid: 1, key: "k", field: "", descr:'关联点的描述信息' },
    linkid:{  },
    //关联多个点
    // linkids: [ { dbid: 1, key: "k1", field: "", descr:'关联点的描述信息' }, 
    //{ dbid: 1, key: "k2", field: "", descr:'关联点的描述信息' } ],
    linkids: [  ],
    freshtype: '1',          // 0 刷新底色 1  刷新数值
    color0: '#00ff00',       // 0值填充
    color1: '#ff0000',       // 1值填充
    digitnum: 2,             // 显示小数位数
    script: '',             //脚本
    fValue: 0,       //实时值保存
    bInit: false ,   //是否初始化成功
    // attr1: 0,
}

//历史数据
export const hg3000hsAttr = {
    hsdata: [],
}

//编辑器左侧组件列表

const list = [
    {
        component: 'VText',
        label: '文字',
        propValue: '文字',
        icon: 'wenben',
        request: {          //使用RESTFUL请求数据
            method: 'GET',
            data: [],
            url: '',
            series: false, // 是否定时发送请求
            time: 1000, // 定时更新时间
            paramType: '', // string object array
            requestCount: 0, // 请求次数限制，0 为无限
        },
        style: {
            width: 200,
            height: 28,
            fontSize: '',
            fontWeight: 400,
            lineHeight: '',
            letterSpacing: 0,
            textAlign: '',
            color: '#000',
            fontFamily: "",         //字体可以是宋体 楷体 黑体
        },
    },
    {
        component: 'RectShape',
        label: '矩形',
        propValue: '',
        icon: 'xingzhuang-juxing',
        style: {
            width: 100,
            height: 100,
            fontSize: '',
            fontWeight: 400,
            lineHeight: '',
            letterSpacing: 0,
            textAlign: 'center',
            color: '#000',
            borderColor: '#000',
            borderWidth: 1,
            backgroundColor: '',
            borderStyle: 'solid',
            borderRadius: '',
            verticalAlign: 'middle',
        },
    },
    {
        component: 'LineShape',
        label: '直线',
        propValue: '',
        icon: 'line',
        style: {
            width: 200,
            height: 2,
            backgroundColor: '#000',
        },
    },
    {
        component: 'CircleShape',
        label: '圆形',
        propValue: '&nbsp;',
        icon: 'xingzhuang-tuoyuanxing',
        style: {
            width: 100,
            height: 100,
            fontSize: '',
            fontWeight: 400,
            lineHeight: '',
            letterSpacing: 0,
            textAlign: 'center',
            color: '',
            borderColor: '#000',
            borderWidth: 1,
            backgroundColor: '',
            borderStyle: 'solid',
            borderRadius: '',
            verticalAlign: 'middle',
        },
    },
    {
        component: 'VButton',
        label: '按钮',
        propValue: '按钮',
        icon: 'anniu1',
        style: {
            width: 100,
            height: 34,
            borderWidth: 1,
            borderColor: '',
            borderRadius: '',
            fontSize: '20',
            fontWeight: 400,
            lineHeight: '',
            letterSpacing: 0,
            textAlign: '',
            color: '#000',
            backgroundColor: '',
            fontFamily: "",
        },
    },
    {
        component: 'Picture',
        label: '图片',
        icon: 'tupian',
        propValue: {
            // url: require('@/assets/flower.png'),
            url: 'picture/flower.png',
            flip: {
                horizontal: false,
                vertical: false,
            },
        },
        style: {
            width: 300,
            height: 200,
            borderRadius: '',
            
        },
    },
    {
        component: 'WinSvg',
        label: 'SVG',
        propValue: {
            picPath: "images/button.svg",
            picMap: [ { value: 0, picpath: "images/1G_stop.svg"  }, 
                {value: 1, picpath: "images/1G_run.svg"} ],
            text : "",
            displayIndex : 0,
        },

        icon: 'tupian',
        request: {          //使用RESTFUL请求数据
            method: 'GET',
            data: [],
            url: '',
            series: false, // 是否定时发送请求
            time: 1000, // 定时更新时间
            paramType: '', // string object array
            requestCount: 0, // 请求次数限制，0 为无限
        },
        style: {
            width: 200,
            height: 200,
            fontSize: '',
            fontWeight: 400,
            lineHeight: '',
            letterSpacing: 0,
            textAlign: '',
            color: '#000',
        },
    },
    {
        component: 'VChart',
        label: '图表',
        icon: 'danzhibangtu_huaban1',
        propValue: {
            chart: 'VChart',
            option: {
                title: {
                    text: '柱状图',
                    show: true,
                    left: 'center',
                },
                legend: {
                    show: false,
                },
                tooltip: {
                    show: true,
                    trigger: 'item',
                },
                xAxis: {
                    show: true,
                    data: ['A', 'B', 'C', 'D', 'E'],
                    axisLabel: {
                        fontSize: 16  // 设置 X 轴文字大小
                    }
                },
                yAxis: {
                    axisLabel: {
                        fontSize: 12  // 设置 Y 轴文字大小
                    }
                },
                series: {
                    type: 'bar',
                    name: '',
                    data: [23.23, 61, 35, 77, 135],
                    itemStyle: {
                        borderRadius: 5,
                        borderWidth: 1,
                        borderType: 'solid',
                        color: 'lightblue',
                        borderColor: '#73c0de',
                        shadowColor: '#5470c6',
                        shadowBlur: 3,
                    },
                },
            },
        },
        style: {
            width: 400,
            height: 400,
            borderRadius: 1,
            
        },
    },
    {
        component: 'VMeter',
        label: '表计',
        icon: 'me_biaojiguanli',
        propValue: {
            chart: 'VMeter',
            option: {
                series: [
                    {
                      name: 'Pressure',
                      type: 'gauge',
                      axisLine: {
                        lineStyle: {
                            color: [[1, '#5470c6']] // 仪表盘背景色  
                        }
                      },
                      pointer: {
                        itemStyle: {
                            color: '#5470c6' // 指针颜色，默认为自动根据仪表盘背景色变化
                        }
                      },
                      min: 0, // 最小值
                      max: 100, // 最大值
                      splitNumber: 10, // 刻度数量
                      progress: {
                        show: false,
                        itemStyle: {
                            color: '#FF6F69' // 进度条颜色  #FF6F69
                        }
                      },
                      detail: {
                        formatter: (value) => value.toFixed(0),
                        fontSize: 16,          // 设置字体大小
                      },
                      data: [
                        {
                          value: 30,
                          name: '电压'
                        }
                      ]
                    }
                  ]
                },
        },
        style: {
            width: 400,
            height: 400,
            digitNum : 0,
        },
    },

    {
        component: 'VTable',
        label: '表格',
        icon: 'biaoge',
        propValue: {
            data: [
                ['表头1', '表头2', '表头3'],
                ['内容1', '内容2', '内容3'],
            ],
            stripe: false,
            thBold: false,
        },
        request: {
            method: 'GET',
            data: [],
            url: '',
            series: false,
            time: 1000,
            paramType: '', // string object array
            requestCount: 0, // 请求次数限制，0 为无限
        },  
        style: {
            width: 300,
            height: 100,
            fontSize: 20,
            fontWeight: 400,
            textAlign: 'center',
            color:'rgb(0,0,0)',
            backgroundColor: 'rgba(255, 255, 255, 1)',
            stripeBackgroundColor: '#dad4d4',
        },
    },
    {
        component: 'VRealCurve',
        label: '曲线',
        icon: 'quxiantu',
        propValue: {
            lineNums:  1,       //曲线的条数
            pointNums: 5,      //显示的点数
            rtDataIns: 0,       //数据活动标识,给watch使用
            rtdata: [],         //实时数据
            border:  false,   //边框
            option:{
                backgroundColor: '#f5f5f5',
                title: {
                    text: '实时曲线图',
                    show: true,
                    left: 'center',
                    top: '8%', // 距离顶部 10%
                },
                color: [], //线的颜色定义  '#00ff00'
                legend: {
                    show: true ,
                    right: 'right',
                    top: 'center',
                    textStyle: {
                      color: '#000000',     // 图例文字颜色
                      fontSize: 16          // 字体大小
                    }
                },
                xAxis: {
                  type: 'category',
                  data: [ '','','','','' ]
                },
                yAxis: {
                  type: 'value',
                  min: 0, // 设置最小值
                  max: 10, // 设置最大值
                },
                series: [
                //   {
                //     name: '变量',
                //     data: [1, 3, 5, 2, 4],
                //     type: 'line',
                //   },
                ]

            },
        },

        style: {
            width: 400,
            height: 400,
        },
    },

    // {
    //     component: 'SVGStar',
    //     label: '星形',
    //     icon: 'kongwujiaoxing',
    //     propValue: '',
    //     style: {
    //         width: 80,
    //         height: 80,
    //         fontSize: '',
    //         fontWeight: 400,
    //         lineHeight: '',
    //         letterSpacing: 0,
    //         textAlign: 'center',
    //         color: '',
    //         borderColor: '#000',
    //         backgroundColor: 'rgba(255, 255, 255, 1)',
    //     },
    // },
    // {
    //     component: 'SVGTriangle',
    //     label: '三角形',
    //     icon: 'xingzhuang-sanjiaoxing',
    //     propValue: '',
    //     style: {
    //         width: 80,
    //         height: 80,
    //         fontSize: '',
    //         fontWeight: 400,
    //         lineHeight: '',
    //         letterSpacing: 0,
    //         textAlign: 'center',
    //         color: '',
    //         borderColor: '#000',
    //         backgroundColor: 'rgba(255, 255, 255, 1)',
    //     },
    // },
    
    // 
]

//这个输出变量表示某个图形的模板对象
export const  shapelist = []

for (let i = 0, len = list.length; i < len; i++) {
    const item = list[i]
    item.style = { ...commonStyle, ...item.style }
    item.hg3000 = { ...hg3000Attr }
    // item.hg3000hs = { ...hg3000hsAttr }

    list[i] = { ...commonAttr, ...item }
    // var mem = {   }
    // mem[ list[i].component ] = list[i]
    shapelist[ list[i].component ] = list[i]
}

// console.log( "shapelist:",  shapelist )

export default list 

